<%--
  Created by IntelliJ IDEA.
  User: Christopher
  Date: 2023/8/6
  Time: 16:28
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<!DOCTYPE html>
<html lang="zh">
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
  <!-- Meta, title, CSS, favicons, etc. -->
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1">

  <title>大帅体检 | 我的预约</title>

  <!-- Bootstrap -->
  <link href="${pageContext.request.contextPath}/css/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet">
  <!-- Font Awesome -->
  <link href="${pageContext.request.contextPath}/css/font-awesome/css/font-awesome.min.css" rel="stylesheet">
  <!-- NProgress -->
  <link href="${pageContext.request.contextPath}/css/nprogress/nprogress.css" rel="stylesheet">

  <!-- iCheck -->
  <link href="${pageContext.request.contextPath}/css/iCheck/skins/flat/green.css" rel="stylesheet">
  <!-- bootstrap-progressbar -->
  <link href="${pageContext.request.contextPath}/css/bootstrap-progressbar/css/bootstrap-progressbar-3.3.4.min.css" rel="stylesheet">
  <!-- JQVMap -->
  <link href="${pageContext.request.contextPath}/css/jqvmap/dist/jqvmap.min.css" rel="stylesheet"/>

  <!-- Custom Theme Style -->
  <link href="${pageContext.request.contextPath}/css/custom.css" rel="stylesheet">
  <style>
    .container .content{
      line-height: 500px;
      text-align: center;
      font-size: 50px;
      text-shadow: 1px 1px 2px black;
    }
  </style>


</head>

<body class="nav-md">
<div class="container body">
  <div class="main_container">
    <div class="col-md-3 left_col">
      <div class="left_col scroll-view">
        <div class="navbar nav_title" style="border: 0;">
          <a href="${pageContext.request.contextPath}" class="site_title"><i class="fa fa-paw"></i> <span>大帅体检</span></a>
        </div>

        <div class="clearfix"></div>

        <!-- menu profile quick info -->
        <div class="profile">
          <div class="profile_pic">
            <img src="${pageContext.request.contextPath}/img/logo.png" alt="..." class="img-circle profile_img">
          </div>
          <div class="profile_info">
            <span>欢迎您,</span>
            <h2>
              <c:if test="${sessionScope.user == null}">
                <a href="${pageContext.request.contextPath}/user/login">请登录</a>
              </c:if>
              <c:if test="${sessionScope.user != null}">
                ${sessionScope.user.name}
              </c:if>
            </h2>
          </div>
        </div>
        <!-- /menu profile quick info -->

        <br />

        <!-- sidebar menu -->
        <div id="sidebar-menu" class="main_menu_side hidden-print main_menu">
          <div class="menu_section">
            <div style="height: 70px;"></div>
            <ul class="nav side-menu">
              <li><a href="${pageContext.request.contextPath}"><i class="fa fa-home"></i> 返回首页 </a>

              </li>


              <li><a><i class="fa fa-table"></i> 我要预约 <span class="fa fa-chevron-down"></span></a>
                <ul class="nav child_menu">
                  <li><a href="${pageContext.request.contextPath}/exam_package/show_packages">查看体检套餐</a></li>
                  <li><a href="${pageContext.request.contextPath}/appointment_record/my_appoint">我的预约</a></li>
                </ul>
              </li>
              <li><a><i class="fa fa-bar-chart-o"></i> 套餐管理<span class="fa fa-chevron-down"></span></a>
                <ul class="nav child_menu">
                  <li><a href="${pageContext.request.contextPath}/health_exam_item/add_health_item"> 体检项目管理</a></li>
                  <li><a href="${pageContext.request.contextPath}/exam_package/show_package_list"> 体检套餐管理</a></li>
                </ul>
              </li>
              <li><a><i class="fa fa-clone"></i> 预约管理 <span class="fa fa-chevron-down"></span></a>
                <ul class="nav child_menu">
                  <li><a href="${pageContext.request.contextPath}/appointment_record/appoint_list"> 查看预约</a></li>
                </ul>
              </li>
            </ul>
          </div>

        </div>

      </div>
      <!-- /sidebar menu -->

      <!-- /menu footer buttons -->
      <div class="sidebar-footer hidden-small">
        <a data-toggle="tooltip" data-placement="top" title="Settings">
          <span class="glyphicon glyphicon-cog" aria-hidden="true"></span>
        </a>
        <a data-toggle="tooltip" data-placement="top" title="FullScreen">
          <span class="glyphicon glyphicon-fullscreen" aria-hidden="true"></span>
        </a>
        <a data-toggle="tooltip" data-placement="top" title="Lock">
          <span class="glyphicon glyphicon-eye-close" aria-hidden="true"></span>
        </a>
        <a data-toggle="tooltip" data-placement="top" title="Logout">
          <span class="glyphicon glyphicon-off" aria-hidden="true"></span>
        </a>
      </div>
      <!-- /menu footer buttons -->
    </div>
  </div>

  <!-- top navigation -->
  <div class="top_nav">

    <div class="nav_menu">
      <nav>
        <div class="nav toggle">
          <a id="menu_toggle"><i class="fa fa-bars"></i></a>
        </div>

        <ul class="nav navbar-nav navbar-right">

          <li class="">
            <a href="javascript:;" class="user-profile dropdown-toggle" data-toggle="dropdown" aria-expanded="false">
              <h2>
                <c:if test="${sessionScope.user == null}">
                  <a href="${pageContext.request.contextPath}/user/login">请登录</a>
                </c:if>
                <c:if test="${sessionScope.user != null}">
                  ${sessionScope.user.name}
                </c:if>
              </h2>
              <span class=" fa fa-angle-down"></span>
            </a>
            <ul class="dropdown-menu dropdown-usermenu pull-right">
              <li><a href="javascript:;">我的信息</a></li>
              <li><a href="javascript:;">修改密码</a></li>
              <li><a href="${pageContext.request.contextPath}/user/logout"><i class="fa fa-sign-out pull-right"></i> 注销登录</a></li>
            </ul>
          </li>
        </ul>

      </nav>
    </div>
  </div>
  <!-- /top navigation -->

  <!-- page content -->
  <div class="right_col"  role="main">
      <div class="">
        <div class="page-title">
          <div class="title_left">
            <h3>体检预约 <small>体检预约记录</small></h3>
          </div>

          <div class="title_right">
            <div class="col-md-5 col-sm-5 col-xs-12 form-group pull-right top_search">
              <div class="input-group">
                <form id="eachForm" action="${pageContext.request.contextPath}/appointment_record/appoint_list"  data-parsley-validate class="form-horizontal">
                  <!--提交当前页默认为第一页-->
                  <input type="hidden" name="pageIndex" value="1">
                  <input type="text" name="uname" class="form-control" placeholder="预约人姓名">
                  <span class="input-group-btn">
                      <input  class="btn btn-default" type="submit" value="查询"></input>
                  </span>
                </form>
              </div>

            </div>
          </div>
        </div>

        <div class="clearfix"></div>

        <div class="row">
          <div class="col-md-12 col-sm-12 col-xs-12">
            <div class="x_panel">
              <div class="x_title">
                <h2>体检预约 <small>体检预约全览</small></h2>
                <ul class="nav navbar-right panel_toolbox">
                  <li><a class="collapse-link"><i class="fa fa-chevron-up"></i></a>
                  </li>
                  <li class="dropdown">
                    <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false"><i class="fa fa-wrench"></i></a>
                    <ul class="dropdown-menu" role="menu">
                      <li><a href="#">Settings 1</a>
                      </li>
                      <li><a href="#">Settings 2</a>
                      </li>
                    </ul>
                  </li>
                  <li><a class="close-link"><i class="fa fa-close"></i></a>
                  </li>
                </ul>
                <div class="clearfix"></div>
              </div>
              <div class="x_content">
                <p class="text-muted font-13 m-b-30">
                </p>
                <table id="datatable" class="table table-striped table-bordered">
                  <thead>
                  <tr>
                    <th>编号</th>
                    <th>套餐名</th>
                    <th>预定人姓名</th>
                    <th>预定人身份证号码</th>
                    <th>预定人手机号</th>
                    <th>预定时间</th>
                    <th>预定状态</th>
                  </tr>
                  </thead>
                  <tbody>
                  <c:forEach items="${result.data}" var="r" varStatus="s">
                    <tr>
                      <td>${s.count}</td>
                      <td>${r.healthExamPackage.name}</td>
                      <td>${r.user.name}</td>
                      <td>${r.user.idNo}</td>
                      <td>${r.user.mobileNo}</td>
                      <td>${r.appointmentTime}</td>
                      <c:if test="${r.appointmentStatus == 2}">
                        <td>体检完成</td>
                      </c:if>
                      <c:if test="${r.appointmentStatus == 1}">
                        <td>预定中</td>
                      </c:if>
                      <c:if test="${r.appointmentStatus == 0}">
                        <td>已取消</td>
                      </c:if>
                      <td>
                        <a href="${pageContext.request.contextPath}/appointment_record/confirm/${r.id}">体检完成</a>
                      </td>
                    </tr>
                  </c:forEach>

                  </tbody>
                </table>

                <div>
                  <span>每页${pager.pageSize }条/共${pager.totalRow }条</span><span>当前${pager.pageIndex }页/共${pager.totalPage }页</span>
                  <button onclick="goPage(1)">首页</button>
                  <button onclick="goPage(${pager.pageIndex-1})">上一页</button>
                  <button onclick="goPage(${pager.pageIndex+1})">下一页</button>
                  <button onclick="goPage(${pager.totalPage})">末页</button>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
  </div>
  <!-- /page content -->

  <!-- footer content -->
  <footer>
    <div class="pull-right">
      大帅体检 - 关注您的健康 by <a href="https://www.dshealth.com">大帅体检</a>
    </div>
    <div class="clearfix"></div>
  </footer>
  <!-- /footer content -->
</div>
</div>
<script src="${pageContext.request.contextPath}/js/jquery.js"></script>
<script src="${pageContext.request.contextPath}/css/bootstrap/dist/js/bootstrap.min.js"></script>
<script src="${pageContext.request.contextPath}/js/fastclick.js"></script>
<script src="${pageContext.request.contextPath}/js/nprogress.js"></script>
<script src="${pageContext.request.contextPath}/js/Chart.js"></script>
<script src="${pageContext.request.contextPath}/js/gauge.js"></script>
<script src="${pageContext.request.contextPath}/js/bootstrap-progressbar.min.js"></script>
<script src="${pageContext.request.contextPath}/js/icheck.js"></script>
<script src="${pageContext.request.contextPath}/js/skycons.js"></script>
<script src="${pageContext.request.contextPath}/js/jquery.flot.js"></script>
<script src="${pageContext.request.contextPath}/js/jquery.flot.pie.js"></script>
<script src="${pageContext.request.contextPath}/js/jquery.flot.time.js"></script>
<script src="${pageContext.request.contextPath}/js/jquery.flot.stack.js"></script>
<script src="${pageContext.request.contextPath}/js/jquery.flot.resize.js"></script>
<script src="${pageContext.request.contextPath}/js/jquery.flot.orderBars.js"></script>
<script src="${pageContext.request.contextPath}/js/jquery.flot.spline.min.js"></script>
<script src="${pageContext.request.contextPath}/js/curvedLines.js"></script>
<script src="${pageContext.request.contextPath}/js/date.js"></script>
<script src="${pageContext.request.contextPath}/js/jquery.vmap.js"></script>
<script src="${pageContext.request.contextPath}/js/jquery.vmap.world.js"></script>
<script src="${pageContext.request.contextPath}/js/jquery.vmap.sampledata.js"></script>
<script src="${pageContext.request.contextPath}/js/moment.min.js"></script>
<script src="${pageContext.request.contextPath}/js/daterangepicker.js"></script>
<script src="${pageContext.request.contextPath}/js/custom.min.js"></script>
<script>
  function goPage(index){
    //如果要跳转的页面小于1，将要跳转的页面设置为1
    if (index < 1){
      index = 1;
    }
    //如果要跳转的页面大于总页数，将要跳转的页面设置为总页数
    if (index > "${pager.totalPage}"){
      index = "${pager.totalPage}";
    }
    $("[name='pageIndex']").val(index);
    $("#eachForm").submit();
  }
</script>

</body>
</html>

